<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:ui="http://java.sun.com/jsf/facelets"  
      xmlns:f="http://java.sun.com/jsf/core"  
      xmlns:p="http://primefaces.org/ui">
    <h:head>
        <title>:: Acceso a HelpDesk ::</title>
    </h:head>
    <h:body onload="dlg.show()">   
        
        <h:outputStylesheet library="css" name="resources/css/default.css"/>
         <link href="resources/css/default.css" rel="stylesheet" type="text/css" />
        <link href="resources/css/cssLayout.css" rel="stylesheet" type="text/css" />
        
        
    <p:graphicImage value="/images/login.gif" />  
  
<p:growl id="growl" showDetail="true" life="3000" />  
  
<p:dialog id="dialog" header="Acceso a HelpDesk" widgetVar="dlg" resizable="false" closable="false">  
    
    <h:form id="loginform">  
  
        <p:panelGrid columns="2" cellpadding="5">  
            <h:outputLabel for="username" value="Usuario:" />  
            <p:inputText value="#{mBLogin.user}"   
                    id="username" required="true" label="username" />  
              
            <h:outputLabel for="password" value="Contraseña:" />  
            <h:inputSecret value="#{mBLogin.pass}"   
                    id="password" required="true" label="password" />  
              
            <f:facet name="footer">
                <table width="195" cellpadding="0" cellspacing="0" border="0" align="center" style="border-color:transparent">
                    <tr><td align="center">
                <p:commandButton id="loginButton" value="Aceptar" update=":growl"   
                    action="#{mBLogin.action}"   
                    oncomplete="handleLoginRequest(xhr, status, args)"/>  
                <p:commandButton value="Cancelar" type="reset"/>
                </td></tr></table>
            </f:facet>  
        </p:panelGrid>  
          
    </h:form> 
    <script>
     document.getElementById('loginform:username').focus();
     //document.getElementById('loginform:username').className = 'highlight';
    </script>

    <style>
    .highlight {
    background-color: #fcc;
    }
    </style>
</p:dialog>  

  
<script type="text/javascript">  
    function handleLoginRequest(xhr, status, args) {  
        if(args.validationFailed || !args.loggedIn) {  
            jQuery('#dialog').effect("shake", { times:2 }, 100);  
        } else {  
            dlg.hide();  
            jQuery('#loginLink').fadeOut();  
        }  
    }  
</script>
    </h:body>
</html>

